<template>
    <div class="login-container">
        <!-- 背景装饰元素 -->
        <view class="bg-decoration bg-circle-1"></view>
        <view class="bg-decoration bg-circle-2"></view>
        <view class="bg-decoration bg-circle-3"></view>

        <!--head-->
        <div class="login-header">
            <image class="login-logo" src="@/static/logo.svg" mode="aspectFit"></image>
        </div>
        <div class="welcome-text">欢迎登录</div>

        <!--content-->
        <up-form :model="loginForm" ref="formRef">
            <!--<div class="input-wrapper" @click="openDeptSelect">-->
                <!--<up-input v-model="loginForm.deptName" class="login-input" prefixIcon="home"-->
                          <!--placeholder="请输入公司名称" disabled style="pointer-events: none;"/>-->
            <!--</div>-->
            <div class="input-wrapper">
                <up-input v-model="loginForm.trainerName" class="login-input" prefixIcon="account" clearable
                          placeholder="请输入用户名"/>
            </div>
            <div class="input-wrapper">
                <up-input v-model="loginForm.idCardNumber" class="login-input" prefixIcon="file-text" clearable
                          placeholder="请输入身份证后6位" maxlength="6"/>
            </div>
        </up-form>
        <div class="mt-5 mb-5">
            <div class="flex-x-end" style="color: #2979FF" @click="goRegister">未注册？注册入口</div>
            <!--<up-link  text="未注册"/>-->
        </div>

        <up-button class="login-btn" type="primary" text="登录" @click="handleLogin"></up-button>
        <!---->
        <!--<up-picker :show="deptPickerShow" :columns="deptList" @confirm="deptPickerConfirm" @cancel="deptPickerClose"-->
                   <!--@close="deptPickerClose" keyName="deptName" valueName="deptId" closeOnClickOverlay></up-picker>-->

    </div>
</template>

<script name="login" setup>
    import {test} from 'uview-plus';
    import {setToken} from '@/utils/token'

    /** Base*/
    const {proxy} = getCurrentInstance()
    /** Data*/
    const appLogo = ref('/static/vite.png')
    const loginForm = ref({
        // deptId: '',
        // deptName: '',
        trainerName: '',
        idCardNumber: ''
    })
    // const deptList = ref([])
    // const deptPickerShow = ref(false)
    const formRef = ref(null)

    /** 生命周期 */
    onLoad((option) => {
        // loginForm.value.deptId = uni.getStorageSync('deptId')
        // loginForm.value.deptName = uni.getStorageSync('deptName')
        loginForm.value.trainerName = uni.getStorageSync('trainerName')
        loginForm.value.idCardNumber = uni.getStorageSync('idCardNumber')
        // getDeptList()
    })

    /** Method */
    const goRegister = async () => {
        uni.navigateTo({url: '/pages/register/index'})
    }
    // 登录
    const handleLogin = async () => {
        let _ = proxy
        // if (!loginForm.value.deptId) {
        //     _.$T.showToast('请选择公司')
        //     return
        // }
        if (!loginForm.value.trainerName) {
            _.$T.showToast('请输入用户名')
            return
        }
        if (!test.rangeLength(loginForm.value.idCardNumber, [6, 6])) {
            _.$T.showToast('请输入身份证后六位')
            return
        }
        uni.setStorageSync('trainerName', loginForm.value.trainerName)
        // uni.setStorageSync('deptId', loginForm.value.deptId)
        uni.setStorageSync('deptName', loginForm.value.deptName)
        uni.setStorageSync('idCardNumber', loginForm.value.idCardNumber)
        const {data: res} = await _.$H.post(_.$A.login, loginForm.value)
        if (res.code == 200) {
            setToken(res.data.token)
            uni.reLaunch({url: '/pages/home/index'})
        }
    }
    // const getDeptList = async () => {
    //     let _ = proxy
    //     const {data: res} = await _.$H.post(_.$A.dept.list, {}, {custom: {hideLoading: true}})
    //     deptList.value = [res.data] || []
    //     console.log('getDeptList', deptList.value)
    // }
    //
    // const openDeptSelect = async () => {
    //     deptPickerShow.value = true
    // }
    // const deptPickerClose = async () => {
    //     deptPickerShow.value = false
    // }
    // const deptPickerConfirm = async (val) => {
    //     console.log('deptPickerConfirm', val.value[0].deptId)
    //     loginForm.value.deptId = val.value[0].deptId
    //     loginForm.value.deptName = val.value[0].deptName
    //     deptPickerShow.value = false
    // }
</script>

<style lang="scss" scoped>
    @import 'index.scss';
</style>